<script lang='ts' setup>
import { ref, reactive } from 'vue';
import { useRouter } from 'vue-router'
import Oauth2ClientDetailsForm from './component/oauth2-client-details-form.vue';
import { redirectPath } from '/@/utils/router-kit';
import { Oauth2ClientDetailsListUrl, Oauth2ClientDetailsEditUrl } from '/@/views/org/mapping.json'
const router = useRouter();
const Oauth2ClientDetailsFormRef = ref();
const Oauth2ClientDetailsFormState = reactive({
    clientId: router.currentRoute.value.params.id as string,
    onBackClick: () => router.push({ path: Oauth2ClientDetailsListUrl }),
    saveForm: () => Oauth2ClientDetailsFormRef.value.save(),
    /**新增成功 跳转页面 */
    onAddFormSuccess: (formData: any) => {
        redirectPath(Oauth2ClientDetailsEditUrl + formData.clientId)
    }
})
</script>
<template>
    <jxtech-basic-header :breadcrumbMappingUrl="Oauth2ClientDetailsListUrl">
        <template #extra>
            <jxtech-save-button @click="Oauth2ClientDetailsFormState.saveForm"></jxtech-save-button>
            <jxtech-back-button @click="Oauth2ClientDetailsFormState.onBackClick"></jxtech-back-button>
        </template>
    </jxtech-basic-header>
    <el-card >
        <template #header>
            <div class="jxtech-card-title">
                <span>oauth2客户端配置</span>
            </div>
        </template>
        <oauth2-client-details-form
            ref="Oauth2ClientDetailsFormRef"
            :client-id="Oauth2ClientDetailsFormState.clientId"
            @add-success="Oauth2ClientDetailsFormState.onAddFormSuccess"
        ></oauth2-client-details-form>
    </el-card>
</template>